Panels and controls topic

The glass a screen is made of. Each wears the theme's finish unless it names its own, and picks a label colour that reads over it.

Widget	What it is
GlassBar	A capsule for a title, a search field or a row of actions.
GlassButton	A tappable capsule that brightens while held.
GlassCard	A panel for grouped content.
GlassSwitch, GlassSlider	Controls whose knob turns into a clear drop while held. A slider with `divisions` lands on stops.
GlassSegmentedControl	The selection lifts into a drop that slides between segments.
GlassTabBar	A tab bar whose selection is a drop that can be dragged between tabs. It collapses to its selected tab on a scroll down under a GlassTabBarMinimizer, and carries a `bottomAccessory`.
GlassStepper	A minus and a plus in one glass capsule; a held half repeats, and the end at a limit is disabled. One surface; a press is no capture.
GlassPageControl	Page dots on a glass capsule; follows and turns a `PageController`, a tap steps toward its side, a drag scrubs. One surface.
GlassButtonGroup	One capsule of icon buttons (GlassToolbarItem): one surface however many.
GlassTextField	A single line of text in a glass capsule.
GlassSearchBar	The search field with a clear button and a Cancel that slides in on focus. One surface; the slide costs a capture a frame for 250 ms (16 captures; 1 with reduced motion).
GlassBadge	A count or a dot on an icon's corner, as an opaque red capsule. Not glass, as Apple's isn't; costs no surface.
GlassScrollEdge	iOS's soft edge under a bar, where content scrolls away.
GlassScaffold	A whole screen: host, top bar, scroll edge, bottom bar and floating action.

A bar of actions

GlassBar(
  child: Row(
    children: <Widget>[
      const Expanded(child: Text('Inbox')),
      GlassButton(onPressed: compose, child: const Icon(Icons.edit)),
    ],
  ),
)

Inside a bar, plain icons are cheaper than GlassButtons, which are glass on glass; a row of actions is cheapest as a GlassButtonGroup.

Controls

GlassCard(
  child: Column(
    children: <Widget>[
      GlassSwitch(value: on, onChanged: (bool v) => setState(() => on = v)),
      GlassSlider(value: level, onChanged: (double v) => setState(() => level = v)),
    ],
  ),
)

The drop of a switch, a slider, a segmented control and a tab bar moves inside a travel region of its own: dragging it takes no capture. The button, switch, slider, segmented control, stepper, page control and a toolbar's cells take the keyboard's focus. Inside a horizontal PageView or list, a horizontal drag that starts on the switch, slider or segmented control moves the control and not the page, and a vertical swipe still scrolls the vertical list around it.

A stepper with its value

Row(
  children: <Widget>[
    Expanded(child: Text('Copies: $copies')),
    GlassStepper(
      value: copies.toDouble(),
      min: 1,
      max: 10,
      semanticLabel: 'Copies',
      onChanged: (double v) => setState(() => copies = v.round()),
    ),
  ],
)

A tab bar that collapses on scroll

GlassScaffold(
  // The scaffold is a GlassTabBarMinimizer: the body's scrolls reach the bar.
  bottomBar: GlassTabBar(
    items: tabs,
    selectedIndex: tab,
    onSelected: (int i) => setState(() => tab = i),
    minimizeBehavior: GlassTabBarMinimizeBehavior.onScrollDown,
  ),
  body: ListView.builder(itemCount: 50, itemBuilder: buildRow),
)

Classes

GlassBadge Panels and controls: A count or a dot on the corner of child — an opaque red capsule, not glass, as iOS 26 draws a badge.
GlassBar Panels and controls: A glass bar: the navigation layer, which is where Apple's guidelines put this material.
GlassButton Panels and controls: A glass control: a capsule that takes a tap and brightens while held.
GlassButtonGroup Panels and controls: Adjacent actions in one glass capsule — a circle for one — as iOS 26's toolbar draws them. One surface whatever the count.
GlassCard Panels and controls: A glass card: the same panel as GlassBar with a corner instead of a capsule.
GlassPageControl Panels and controls: Page dots on a glass capsule — iOS's UIPageControl on its platter.
GlassScaffold Panels and controls: A screen: a body that scrolls under a glass topBar, with an optional bottomBar and floatingAction, under a GlassHost.
GlassScrollEdge Panels and controls: The scroll edge effect under a bar, and the bar.
GlassSearchBar Panels and controls: A search field in a glass capsule, with a clear button while there is text and a Cancel button that slides in beside it while it has the focus.
GlassSegmentedControl Panels and controls: A row of mutually exclusive segments; the selected one lifts into a clear glass drop while a finger is on it. See the file comment for what it costs.
GlassSlider Panels and controls: A slider whose knob becomes a clear glass drop while it is held.
GlassStepper Panels and controls: A minus and a plus in one glass capsule, stepping a number between min and max — iOS's UIStepper.
GlassSwitch Panels and controls: A switch whose knob becomes a clear glass drop while it is held.
GlassTabBar Panels and controls: A bottom bar of tabs whose selection becomes a glass drop under a finger.
GlassTabBarMinimizer Panels and controls: Says whether the content below has scrolled down, for the GlassTabBars below it that collapse on a scroll (GlassTabBarMinimizeBehavior.onScrollDown).
GlassTabItem Panels and controls: One item of a GlassTabBar.
GlassTabItemLook Panels and controls: What a GlassTabBar resolved for one of its items, as it draws it.
GlassTextField Panels and controls: A single line of text in a glass capsule.
GlassToolbarItem Panels and controls: One action of a GlassButtonGroup.
SliderGeometry Panels and controls: Where the slider's fill ends for a value, on a slider width wide.

Constants

kGlassBadgeDot → const double Panels and controls: A dot badge's diameter, logical px. Layout, not a reading.
kGlassBadgeHeight → const double Panels and controls: A badge's height with a count in it, logical px — and its smallest width, so one digit is a circle. Layout, not a reading.
kGlassBadgeRed → const Color Panels and controls: iOS's systemRed in the light appearance, (255, 59, 48): the badge's fill by default. The dark appearance's is (255, 69, 58); the package has no appearance of its own, so pass that one where yours is dark.
kGlassDisabledDarkLabel → const Color Panels and controls: The label of a disabled GlassButton whose enabled label is black, and whose enabled label is white.
kGlassDisabledLightLabel → const Color Panels and controls: The label of a disabled GlassButton whose enabled label is white: tertiaryLabel in dark, (235, 235, 245) at 0.3.
kGlassDisabledOpacity → const double Panels and controls: How opaque a disabled switch or slider is, drawn as one group.
kGlassDropDuration → const Duration Panels and controls: How long the drop of a GlassSwitch or a GlassSlider takes to lift or settle.
kGlassDropOptics → const GlassOptics Panels and controls: The optics of a held drop, which are not the material's.
kGlassDropScale → const double Panels and controls: How much larger a held drop is than the resting knob, by default.
kGlassFieldHeight → const double Panels and controls: The field's height (iOS 26.5's standalone search field, 44 pt).
kGlassFocusRingColor → const Color Panels and controls: The focus ring's colour: iOS's system blue in dark, which is also the slider's default fill.
kGlassFocusRingGap → const double Panels and controls: The gap between a control's edge and its focus ring, logical px.
kGlassFocusRingWidth → const double Panels and controls: The focus ring's stroke, logical px.
kGlassMinTapTarget → const Size Panels and controls: The smallest a control may be, logical px — Apple's Human Interface Guidelines, 44 x 44 pt.
kGlassPageControlHeight → const double Panels and controls: The capsule's height, logical px. Layout, not a reading; the control is laid out kGlassMinTapTarget tall around it.
kGlassPageDot → const double Panels and controls: A page dot's diameter, logical px. Layout, not a reading.
kGlassPageDotGap → const double Panels and controls: The space between two dots, logical px. Layout, not a reading.
kGlassScaffoldActionGap → const double Panels and controls: How far the floating action stands from the screen's end edge and from the bottom bar, logical px. Layout taste, as Material's.
kGlassScaffoldBarHeight → const double Panels and controls: GlassScaffold.topBarHeight's default, logical px. Layout taste, not a measurement: Material's toolbar height, which the example's shell uses.
kGlassScaffoldBarMargin → const EdgeInsets Panels and controls: GlassScaffold.barMargin's default: the space around each bar, inside the safe area. Layout taste.
kGlassScrollEdgeDarkTint → const Color Panels and controls: The soft edge's tint at the edge over dark content: black at 0.25, read over content whose mean was a mid grey.
kGlassScrollEdgeHardFill → const Color Panels and controls: The hard edge's band: a near-opaque white, 0.90 over both a dark and a light field. A dark appearance was not photographed.
kGlassScrollEdgeHardSigma → const double Panels and controls: The hard edge's blur: a bound, not a reading — see the file comment.
kGlassScrollEdgeLightTint → const Color Panels and controls: The soft edge's tint at the edge over light content: white at 0.85.
kGlassScrollEdgeSigma → const double Panels and controls: The soft edge's blur, logical px (read as 1.55–1.67).
kGlassSegmentDropGrow → const Size Panels and controls: How far past the resting capsule the held drop reaches, across and down, logical px (iOS 26.5: 86 x 28 -> 110 x 44).
kGlassSegmentDropWiden → const double Panels and controls: How much of the backdrop past its box the held drop shows (iOS 26.5: a margin of 2.9 pt is the better of two poor fits).
kGlassSegmentTrack → const Color Panels and controls: The track's fill: iOS's tertiarySystemFill, read off the simulator as (116–127) at 0.12.
kGlassStepperRepeatDelay → const Duration Panels and controls: How long a held half waits before it starts to repeat, and how often it repeats after that.
kGlassStepperRepeatInterval → const Duration Panels and controls: See kGlassStepperRepeatDelay.
kGlassStepperSize → const Size Panels and controls: The stepper's capsule, logical px: UIStepper's 94 across, and the segmented control's 32-px track down.
kGlassSwitchDropWiden → const double Panels and controls: How far past its own box the held switch's drop shows, logical px — the iOS switch's drop minifies what is under it (×0.85 across, ×0.79 down on a 58 × 38 pt drop), which is this one margin rather than one zoom. The slider's drop, read the same way, does not minify, and its default is 0. See GlassOptics.widen.
kGlassSwitchSize → const Size Panels and controls: The iOS 26 switch's track, logical px. Its resting knob is 38 x 24.
kGlassTabAccessoryHeight → const double Panels and controls: The height of GlassTabBar.bottomAccessory's glass, logical px. Layout taste: the bar's minimum tap target and a little.
kGlassTabDropGrow → const double Panels and controls: How much larger than the resting capsule the held drop is, on every side, logical px.
kGlassTabDropZoom → const double Panels and controls: How much the held drop magnifies the bar under it.
kGlassTabMinimizeScroll → const double Panels and controls: How far the content has to scroll one way, logical px, before a GlassTabBarMinimizer says so: past this down, the bars collapse; past it up, they expand. Layout taste — enough to ignore a finger settling, short enough that a deliberate scroll is answered at once.
kGlassToolbarHeight → const double Panels and controls: The group's height, and the circle a group of one is, as iOS 26.5 draws it.
kGlassToolbarItemWidth → const double Panels and controls: Each item's width in a group of more than one: 159 pt for three on iOS 26.5.

Enums

GlassScrollEdgeAppearance Panels and controls: Which way a soft edge tints: toward white over light content, toward black over dark. Apple picks it from the content; see GlassScrollEdge.appearance.
GlassScrollEdgeSide Panels and controls: Which side of the scroll view the effect is on.
GlassScrollEdgeStyle Panels and controls: Apple's two styles of scroll edge effect.
GlassTabBarMinimizeBehavior Panels and controls: When a GlassTabBar collapses to its selected tab — iOS 26's TabBarMinimizeBehavior, two of its cases.

Typedefs

GlassTabItemBuilder = Widget Function(BuildContext context, GlassTabItemLook look) Panels and controls: Builds an item's icon or label from what the bar resolved for it.

Panels and controls topic

A bar of actions

Controls

A stepper with its value

A tab bar that collapses on scroll

Classes

Constants

Enums

Typedefs

g1455 package

Panels and controls topic